<div class="tlp-framed-vertically">
    <h1 class="tlp-framed-horizontally">{{# dgettext }}tuleap-create_test_env | Create test environment{{/ dgettext }}</h1>

    <nav class="tlp-tabs">
        <a class="tlp-tab" href="/plugins/create_test_env/notification-bot">{{# dgettext }}tuleap-create_test_env | Notification bot{{/ dgettext }}</a>
        <a class="tlp-tab tlp-tab-active" href="/plugins/create_test_env/call-me-back">{{# dgettext }}tuleap-create_test_env | Call me back{{/ dgettext }}</a>
    </nav>

    <div class="tlp-framed-horizontally">
        <form class="tlp-pane call-me-back-configuration-pane" method="post">
            <div class="tlp-pane-container">
                <div class="tlp-pane-header">
                    <h1 class="tlp-pane-title">{{# dgettext }}tuleap-create_test_env | Call me back configuration{{/ dgettext }}</h1>
                </div>
                <section class="tlp-pane-section">
                    <div class="tlp-form-element">
                        <label class="tlp-label" for="call-me-back-email">Notified email</label>
                        <div class="tlp-form-element tlp-form-element-prepend">
                            <span class="tlp-prepend"><i class="fa fa-envelope-o"></i></span>
                            <input type="email"
                                id="call-me-back-email"
                                class="tlp-input"
                                name="email"
                                size="40"
                                placeholder="{{# dgettext }}tuleap-create_test_env | jdoe@example.com{{/ dgettext }}"
                                value="{{ email }}"
                            >
                        </div>
                    </div>
                    <div class="tlp-form-element">
                        <div class="call-me-back-message-label">
                            <label class="tlp-label">{{# dgettext }}tuleap-create_test_env | Message{{/ dgettext }}</label>
                            <select id="call-me-back-message-select-language" class="tlp-select tlp-select-small tlp-select-adjusted">
                                {{# messages }}
                                    <option value="{{ language_id }}">{{ language_id }}</option>
                                {{/ messages }}
                            </select>
                        </div>
                        {{# messages }}
                            <textarea id="call-me-back-message-{{ language_id }}"
                                class="tlp-textarea"
                                name="messages[{{ language_id }}]"
                                placeholder="{{# dgettext }}tuleap-create_test_env | This is my message{{/ dgettext }}"
                                rows="3"
                            >{{ message }}</textarea>
                        {{/ messages }}
                    </div>
                    <section class="tlp-pane-section-submit">
                        {{# csrf_token }}
                            {{> csrf_token_input }}
                        {{/ csrf_token }}
                        <button type="submit" class="tlp-button-primary">
                            {{# dgettext }}tuleap-create_test_env | Save{{/ dgettext }}
                        </button>
                    </section>
                </section>
            </div>
        </section>
    </div>
</div>
